<template>
	<view>
		<uni-nav-bar :fixed="false" color="#333333" background-color="#FFFFFF" right-icon="scan" @click-right="scan">
			<block slot="left">
				<view class="city">
					<view>{{currentShop.shopName||'门店'}}</view>
				</view>
			</block>
			<view class="input-view">
				<uni-icon type="search" size="22" color="#666666" @click="scan"/>
				<input confirm-type="search" class="input" type="text" placeholder="手动输入条码" @confirm="search" />
			</view>
		</uni-nav-bar>
	</view>
</template>

<script>
	import uniNavBar from "@/components/uni-nav-bar/uni-nav-bar.vue"
	import uniIcon from "@/components/uni-icon/uni-icon.vue"
	import {
		mapState,
		mapMutations
	} from 'vuex'
	export default {
		computed: mapState(['hasLogin']),
		components: {
			uniNavBar,
			uniIcon
		},
		data() {
			return {
				shop:[],
				currentShop:{},
				userInfo:uni.getStorageSync('userInfo')
			}
		},
		onShow() {
			if(!this.hasLogin){
				uni.navigateTo({
					url: '/pages/main/login',
				});
			}
			this.currentShop=uni.getStorageSync('currentShop');
		},
		methods: {
			search(e){
				if(JSON.stringify(this.currentShop).length<=2){
					uni.showToast({
						title:'请先设置当前门店'
					});
					return;
				}
				var data=encodeURIComponent(JSON.stringify({code:e.target.value,shopId:this.currentShop.id}))
				uni.navigateTo({
					url:'/pages/stock/editItem?data='+data,
				});
			},
			scan(){
				// 允许从相机和相册扫码
				var that=this;
				try{
					uni.scanCode({
						scanType:['barCode'],
						success: function(res) {
							console.log('条码类型：' + res.scanType);
							console.log('条码内容：' + res.result);
							var data=encodeURIComponent(JSON.stringify({code:res.result,shopId:that.currentShop.id}))
							uni.navigateTo({
								url:'/pages/stock/editItem?data='+data,
							});
						}
					});
				}catch(e){
					uni.showToast({
						title: e.message,
						icon: "none"
					});
				}
			},
		}
	}
</script>

<style>
	page {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		background-color: #fff
	}

	view {
		font-size: 28rpx;
		line-height: inherit
	}

	.example {
		padding: 0 30rpx 30rpx
	}

	.example-title {
		font-size: 32rpx;
		line-height: 32rpx;
		color: #777;
		margin: 40rpx 25rpx;
		position: relative
	}

	.example .example-title {
		margin: 40rpx 0
	}

	.example-body {
		padding: 0 40rpx
	}

	page {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		background-color: #fff;
	}

	view {
		font-size: 28rpx;
		line-height: inherit;
	}

	.example {
		padding: 0 30rpx 30rpx;
	}

	.example-title {
		font-size: 32rpx;
		line-height: 32rpx;
		color: #777;
		margin: 40rpx 25rpx;
		position: relative;
	}

	.example .example-title {
		margin: 40rpx 0;
	}

	.example-body {
		padding: 0 40rpx;
	}

	.uni-common-mt {
		color: #7a7e83;
		font-size: 28rpx;
		padding: 30rpx;
	}

	.title {
		font-size: 15px;
		line-height: 20px;
		color: #333333;
		padding: 15px;
	}

	.city {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		width: 100%;
		margin-left: 8px;
		white-space: nowrap;
	}

	.input-view {
		width: 92%;
		display: flex;
		background-color: #e7e7e7;
		height: 30px;
		border-radius: 15px;
		padding: 0 4%;
		flex-wrap: nowrap;
		margin: 7px 0;
		line-height: 30px;
	}

	.input-view .uni-icon {
		line-height: 30px !important;
	}

	.input-view .input {
		height: 30px;
		line-height: 30px;
		width: 94%;
		padding: 0 3%;
	}
</style>
